<template>
  <div class="home">
    <img alt="Vue logo" src="../assets/logo.png">
    <HelloWorld :msg="msg"/>
    <el-button>按钮</el-button>
    <el-button type="primary" circle>
      <ep-search />
    </el-button>
    <el-button type="primary" circle>
      <ep-edit style="width: 1em; height: 1em;" />
    </el-button>
  </div>
</template>

<script>
// @ is an alias to /src
import HelloWorld from '@/components/HelloWorld.vue'
import api from '@/api'
import local from '@/utils/local.js'

export default {
  name: 'HomeView',
  data(){
    return {
      msg: ''
    }
  },
  methods: {},
  components: {
    HelloWorld
  },
  mounted(){
    const that = this
    const cache = local.get('hitokoto')
    console.log(cache)
    if (cache === undefined) {
      api.hitokoto.get({
        c: 'i'
      })
        .then(res => {
          that.msg = res.data.hitokoto
          local.set('hitokoto', res.data.hitokoto)
        })
        .catch(err => console.error(err))
    } 
    else
      that.msg = cache
  }
}
</script>
